<script type="text/javascript">
$(document).ready(function() {
    jQuery("#<?=$this->tableElementName?>").jqGrid({
           sortable: true,
           ajaxGridOptions : {type:"POST"},
           url:'/component-plugin/get-component-table-json/name/<?=$this->componentName?>/table/<?=$this->componentTable?>',
           datatype: "json",
           colNames: $.evalJSON('<?=$this->colNames?>'),
           colModel: $.evalJSON('<?=$this->colModel?>'),
           rowNum:<?=$this->rowNum?>,
           rowList: $.evalJSON('<?=$this->rowList?>'),
           imgpath: '/js/jqGrid/themes/<?=$this->getJqGridTheme?>/images',
           pager: jQuery('#pager2'),
           sortname: '<?=$this->sortName?>',
           viewrecords: true,
           sortorder: "<?=$this->sortOrder?>",
           editurl:'/component-plugin/set-component-table-row-json/name/<?=$this->componentName?>/table/<?=$this->componentTable?>',
           caption:"<?=$this->componentName?> <?=$this->title?>" }).navGrid('#pager2',{edit:true,add:true,del:true});

});

</script>
<table id="<?=$this->tableElementName?>" class="scroll" cellpadding="0" cellspacing="0">
</table>
<div id="pager2" class="scroll" style="text-align:center;"></div>